<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>国际化示例</title>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // 获取用户的首选语言
            var userLang = navigator.language || navigator.userLanguage; 
            var translations = {
                'zh-CN': {
                    'welcome': '欢迎访问我们的网站!'
                },
                'en': {
                    'welcome': 'Welcome to our website!'
                },
                'es': {
                    'welcome': 'Bienvenido a nuestro sitio web!'
                },
                'fr': {
                    'welcome': 'Bienvenue sur notre site!'
                }
            };
 
            // 根据语言设置页面内容
            function setContent() {
                var content = document.querySelector('.content');
                if (translations[userLang] && translations[userLang]['welcome']) {
                    content.textContent = translations[userLang]['welcome'];
                } else {
                    content.textContent = translations['en']['welcome'];
                }
            }
 
            setContent(); // 初始化内容
        });
    </script>
</head>
<body>
    <div class="content"></div>
</body>
</html>